<!--/**
* @author xuyh0817
* @email xuyh0817@foxmail.com
* @date 2022-02-16 15:58
* @version 2.0.0
* @doc todo
* @website todo
* @remark  如果要分发源码，需在本文件顶部保留此文件头信息！！
*/
-->
<template>
  <a-range-picker
    :value="currentValue"
    :locale="locale"
    v-bind="attrs"
    :show-time="showTime"
    :placeholder="placeholder"
    @change="changeHandler"
  >
<!--    <template v-for="(render, key) of slots">-->
<!--      <extend-slot-->
<!--        v-slot:[key]-->
<!--        :key="key"-->
<!--        :data="slotData"-->
<!--        :render="render"-->
<!--      />-->
<!--    </template>-->
<!--    <template v-for="(render, key) of slotScopes">-->
<!--      <extend-slot-->
<!--        :slot="key"-->
<!--        :key="key"-->
<!--        slot-scope="data"-->
<!--        :data="data"-->
<!--        :render="render"-->
<!--      />-->
<!--    </template>-->
  </a-range-picker>
</template>

<script>
import {COMPONENT_TYPE, CUSTOM_EVENT_TYPE} from '../../constants'
// 默认语言为 en-US，如果你需要设置其他语言，推荐在入口文件全局设置 locale
import moment from 'moment'
import ComponentMixin from '../../XRenderMixins/XRenderComponentMixin'
import DateMixin from '../../XRenderMixins/XRenderDateMixin'

export default {
  name: COMPONENT_TYPE.RANGE_PICKER,
  mixins: [ComponentMixin, DateMixin],
  props: {
    value: {
      type: String
    }
  },
  computed: {
    showTime: {
      get() {
        const {attrs} = this
        const {isShowTime, showTime} = attrs
        return isShowTime ? showTime : false
      }
    },
    placeholder: {
      get() {
        const {attrs} = this
        const {placeholderStart, placeholderEnd} = attrs
        return [placeholderStart || '开始日期', placeholderEnd || '结束日期']
      }
    },
    currentValue: {
      get() {
        const {attrs, value, formItem, isDebug} = this

        if (!(value instanceof Array) && typeof (value) !== 'string') {
          isDebug ? console.warn(`${formItem.prop} value类型错误,非String或Array`) : ''
          return []
        }
        const {format} = attrs
        const currentFormat = format || 'YYYY-MM-DD'
        if (value instanceof Array) {
          return this.getDefaultValue(value, currentFormat)
        }
        const split = value.split(',')
        return this.getDefaultValue(split, currentFormat)
      }
    }
  },
  methods: {
    getDefaultValue(value, currentFormat) {
      const first = value[0] ? moment(value[0], currentFormat) : this.dateFormat(currentFormat)
      const last = value[1] ? moment(value[1], currentFormat) : this.dateFormat(currentFormat)
      return [first, last]
    },
    changeHandler(moment, date) {
      const {formItem, attrs} = this
      this.$emit(CUSTOM_EVENT_TYPE.CHANGE, {
        type: COMPONENT_TYPE.RANGE_PICKER,
        prop: formItem ? formItem.prop : '',
        value: date.join(','),
        attrs: attrs,
        formItem: formItem,
        moment
      })
    }
  }
}
</script>

<style scoped>

</style>
